<template>
  <div class="base-count">
    <button @click="count--">-</button>
    <span>{{ count }}</span>
    <button @click="count++">+</button>
  </div>
</template>

<script>
/**
  细节:
  - 在组件中, data配置项必须是一个函数, 保证组件在复用时能够拥有独立的数据对象
  - 当组件被复用时, 都会执行data函数, 返回一个新对象
 */
export default {
  data() {
    console.log("我被执行了");
    return {
      count: 100,
    };
  },
};
</script>

<style>
.base-count {
  margin: 20px;
}
</style>